import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:toast/toast.dart';
import 'package:untitled/pages/view/home/custom_textfield_widget.dart';

class LoginDemo extends StatefulWidget {
  const LoginDemo({Key? key}) : super(key: key);

  @override
  State<LoginDemo> createState() => _LoginDemoState();
}

class _LoginDemoState extends State<LoginDemo> {
 FocusNode _passwordFocusNode = new FocusNode();
 FocusNode _usernameFocusNode = new FocusNode();
 TextEditingController _userNameEditController = new TextEditingController();
 TextEditingController _passwordEditController = new TextEditingController();
 // 控制密码显示
 bool _passwordShow = true;

  @override
  Widget build(BuildContext context) {
    ToastContext().init(context);
    return Scaffold(
     // resizeToAvoidBottomInset: false,
      appBar: AppBar(
        title: Text("登录"),
      ),
      backgroundColor: Colors.white,
      body: Container(
        width:double.infinity,
        height: double.infinity,
        child: Stack(
          children: [
            // 第一层 背景
            Positioned.fill(
              child:Container(
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                    begin: Alignment.topLeft,
                    end: Alignment.bottomRight,
                    colors: [
                      Colors.lightBlueAccent,
                      Colors.blue,
                    ]
                    )
                ),
              ) 
              ),
              // 插入一层 高斯模糊
              Positioned.fill(
                child: BackdropFilter(
                  filter: ImageFilter.blur(sigmaY: 0.3,sigmaX: 0.3),
                  child: Container(
                    color:Colors.white.withOpacity(0.3),
                  ),
                )
              ),
              // 第四层 logo
              Positioned(
                top: 20,
                left: 0,
                right: 0,
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Hero(tag: "logo", 
                      child: Material(
                      color: Colors.transparent,
                      child: ClipOval(
                        child: Image.asset(
                          "assets/germany.png",
                          height: 33,
                          width: 33,
                      ),
                      ),
                  )
                  ),
                  SizedBox(width: 20,),
                  Text(
                    "欢迎登录",
                    style: TextStyle(
                      fontSize: 22,
                      fontWeight: FontWeight.w600,
                      color: Colors.blueGrey

                      ),
                    )
                  ],
                )
              ),
              // 第五层来个输入层
              Positioned(
                bottom: 60,
                right: 60,
                left: 60,
                child: Column(
                  
                  children: [
                  // 手机号 
                  TextFieldWidget(
                    hintText: "手机号", 
                    submit: (value){
                      print("666-$value");
                      if(value.length != 11){
                        // toast
                        Toast.show("请输入11位手机号码");
                        FocusScope.of(context).requestFocus(_usernameFocusNode);
                        return;
                      }
                      _usernameFocusNode.unfocus();
                      FocusScope.of(context).requestFocus(_passwordFocusNode);
                    },
                    focusNode: _usernameFocusNode, 
                    prefixIconData: Icons.phone, 
                    //suffixIconData: Icons.visibility, 
                    //obscureText: true, 
                    onChanged: (value){
                      print("555-$value");
                    }, 
                    controller: _userNameEditController, 
                    
                  ),
                  SizedBox(height: 48,),
                  // 密码
                  TextFieldWidget(
                    hintText: "密码", 
                    submit: (value){
                      if(value.length <6){
                        // toast
                        Toast.show("请输入6位密码");
                        FocusScope.of(context).requestFocus(_passwordFocusNode);
                        return;
                      }
                      _usernameFocusNode.unfocus();
                      _passwordFocusNode.unfocus();
                      sumitFunction();
                    },
                    focusNode: _passwordFocusNode, 
                    prefixIconData: Icons.lock_open_outlined, 
                    suffixIconData:_passwordShow? Icons.visibility:Icons.visibility_off, 
                    obscureText: _passwordShow, 
                    onChanged: (value){}, 
                    controller: _passwordEditController, 
                    onTap: (){
                      setState(() {
                        _passwordShow=!_passwordShow;
                      });
                    }
                  ),
                  SizedBox(height: 48,),
                  // 登录
                   Container(
                    width: double.infinity,
                    height: 44,
                    child: ElevatedButton(
                      child: Text("登录",style: TextStyle(fontSize: 18),),
                      onPressed: (){},
                    ),
                  ),
                  SizedBox(height: 20,),
                  // 注册
                  Container(
                    width: double.infinity,
                    height: 44,
                    child: ElevatedButton(
                      child: Text("注册",style: TextStyle(fontSize: 18),),
                      onPressed: (){},
                    ),
                  )
                  ],
                )
                ),
              //第六层 关闭按钮
              Positioned(
                left: 10,
                top: 20,
                child:CloseButton(
                  color: Colors.black38,
                  onPressed: (){
                    Navigator.of(context).pop();
                  },
                )
                )

          ],
          
        ),
      ),
    );
    
  }

  void sumitFunction() async{
    // 获取用户名
    String userName = _userNameEditController.text;
    String password = _passwordEditController.text;

    if(userName.trim().length != 11){
      // Toast
      Toast.show("请输入11位手机号码");
      return;
    }
    if(password.trim().length<6){
      // toast
      Toast.show("请输入6位密码");
      return;
    }

    Map<String,dynamic> map = {
      "mobile":userName,
      "password":password

    };

    // 网络请求
    //ResponseInfo responseInfo = await dio.post(url,formDataMap:map);

  }
  
 
  
}